{extend name="index/layout" /}

{block name="head"}
<link rel="stylesheet" href="/static/css/user.css?v=1">
<meta name="robots" content="noindex">
{/block}

{block name="content"}
<div class="user-center-container">
    <!-- 用户头部 -->
    <div class="user-header desktop-downloads">
        <h1 class="text-2xl font-bold mb-2">我下載的電腦桌布</h1>
        <p class="opacity-90">管理您的電腦桌布下載記錄</p>
    </div>

    <!-- 导航链接 -->
    <div class="nav-links">
        <a href="/user/generateDesktop" class="nav-link">電腦桌布生成</a>
        <a href="/user/generateMobile" class="nav-link">手機桌布生成</a>
        <a href="/user/desktopFavorites" class="nav-link">電腦桌布收藏</a>
        <a href="/user/mobileFavorites" class="nav-link">手機桌布收藏</a>
        <a href="/user/desktopDownloads" class="nav-link active desktop-downloads">電腦桌布下載</a>
        <a href="/user/mobileDownloads" class="nav-link">手機桌布下載</a>
    </div>

    <!-- 内容容器 -->
    <div class="content-container">

        {if $wallpapers}
            <div class="wallpaper-grid desktop">
                {volist name="wallpapers" id="wallpaper"}
                <div class="wallpaper-card" data-id="{$wallpaper.id}">
                    <div class="wallpaper-image desktop">
                        <a href="/category/{$wallpaper.type_name|rawurlencode}/{$wallpaper.category_name|rawurlencode}/{$wallpaper.title|rawurlencode}">
                            <img src="{$wallpaper.thumbnail}" alt="{$wallpaper.title}" loading="lazy">
                        </a>
                        <div class="download-badge desktop">
                            <i class="fas fa-download"></i> 已下載
                        </div>
                        <div class="download-time desktop">
                            {$wallpaper.action_time}
                        </div>
                    </div>
                    
                </div>
                {/volist}
            </div>
        {else}
            <div class="empty-state">
                <i class="fas fa-download"></i>
                <h3 class="text-lg font-semibold mb-2">還沒有下載任何桌面桌布</h3>
                <p class="text-gray-500 mb-4">去下載一些美麗的桌面桌布吧！</p>
                
            </div>
        {/if}
    </div>
</div>
{/block} 